<template>
    <Layout style="height: 100%" class="main">
        <Sider hide-trigger collapsible :width="256" :collapsed-width="64" v-model="collapsed" class="left-sider"
               :style="{overflow: 'hidden'}">
            <side-menu :menu-list="menuList"></side-menu>
        </Sider>
        <Layout>
            <Header class="header-con">
                header
            </Header>
            <Content class="main-content-con">
                <Layout class="main-layout-con">
                    <Content class="content-wrapper">
                        <!--<keep-alive :include="cacheList">-->
                        <router-view/>
                        <!--</keep-alive>-->
                    </Content>
                </Layout>
            </Content>
        </Layout>
    </Layout>
</template>

<script>
    import SideMenu from './side-menu'
    import './main.less'
    import {mapMutations, mapActions, mapGetters} from 'vuex'

    export default {
        name: "Main",
        data() {
            return {
                collapsed: false
            }
        },
        components: {
            SideMenu
        },
        computed: {
            menuList() {
                return this.$store.getters.menuList
            }
        }
    }
</script>

<style scoped>

</style>
